<page-header></page-header>
<nz-card>
  <div style="width: 800px; margin: 0 auto">
    <nz-table #columnTable [nzData]="listOfData" [nzScroll]="{ x: '1100px' }">
      <thead>
        <tr>
          <th nzLeft [nzWidth]="greatTableDragCfg.nameWidth" [greatTableColumnDrag]="greatTableDragCfg" columnName="nameWidth">
            Full Name
          </th>
          <th nzWidth="200px">Age</th>
          <th nzWidth="200px">Column 1</th>
          <th nzWidth="200px">Column 2</th>
          <th nzWidth="200px">Column 3</th>
          <th nzWidth="200px">Column 4</th>
          <th nzWidth="200px">Column 5</th>
          <th nzWidth="200px">Column 6</th>
          <th nzWidth="100px" nzRight>Action</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let data of columnTable.data">
          <td nzLeft>{{ data.name }}</td>
          <td>{{ data.age }}</td>
          <td>{{ data.address }}</td>
          <td>{{ data.address }}</td>
          <td>{{ data.address }}</td>
          <td>{{ data.address }}</td>
          <td>{{ data.address }}</td>
          <td>{{ data.address }}</td>
          <td nzRight>
            <a>action</a>
          </td>
        </tr>
      </tbody>
    </nz-table>
  </div>
</nz-card>
